<template>
  <view>
    <uni-card>
      <view class="grid grid-cols-6">
        <view class="col-span-5 flex flex-col">
          <view class="text-black text-xl truncate">
            {{ supplier.name }}
          </view>
          <view class="flex">
            <view class="w-20 text-sm text-gray-500">联系方式：</view>
            <view class="text-sm text-gray-700">{{ supplier.contact || '-' }}</view>
          </view>
          <view class="flex">
            <view class="w-20 text-sm text-gray-500">描述：</view>
            <view class="text-sm text-gray-700">{{ supplier.description || '-' }}</view>
          </view>
        </view>
        <view class="col-span-1 flex flex-col items-end justify-end ">
          <view v-if="selected===supplier">
            <u-button @click="handleManage" size="mini">管理</u-button>
          </view>
        </view>
      </view>
    </uni-card>
  </view>
</template>
<script setup lang="ts">


import {type PropType} from "vue";

const props = defineProps({
  supplier: {
    type: Object as PropType<ISupplier>,
    default: () => {
    }
  },
  selected: {
    type: Object as PropType<ISupplier>,
    default: () => {
    }
  },
})
const emits = defineEmits(['manage'])

const handleManage = () => {
  emits('manage', props.supplier)
}


</script>
<style scoped>

</style>